<template>
  <div class="generateSection">
    <el-form ref="form" :model="formData" label-width="80px">
      <el-form-item label="管道材料" prop="meterialid">
        <el-select v-model="formData.meterialid" filterable size="mini" placeholder="请选择">
          <el-option
            v-for="item in pipeMeterials"
            :key="item.C_DICT_PIPEMETERIAL_ID"
            :label="item.NAME"
            :value="item.C_DICT_PIPEMETERIAL_ID">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="横向数量" prop="horizontal">
        <el-input-number v-model="formData.horizontal" size="mini" :min="1"></el-input-number>
      </el-form-item>
      <el-form-item label="纵向数量" prop="vertical">
        <el-input-number v-model="formData.vertical" size="mini" :min="1"></el-input-number>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm" size="mini">提交</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import {get} from 'lodash'; // 导入 lodash-es 中的 get 方法，用于获取对象属性的值
import {sessionStorage} from '@/deps/utils';
import {addPipeSectionApi} from '@/deps/apis/pipeApi';
export default {
  name: 'generateSection',
  props: {
    pipeMeterials: {
      type: Array,
      default: () => []
    },
    featureData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      formData: {
        meterialid: null,
        horizontal: 1,
        vertical: 1
      }
    };
  },
  methods: {
    submitForm() {
      if (!this.formData.meterialid) {
        this.$message.error('请选择管道材料');
        return;
      }
      const params = {
        pipelineid: get(this.featureData, 'properties.SMID', ''),
        userName: get(sessionStorage('userData'), 'userName', ''),
        baseinfoid: 1,
        meterialid: this.formData.meterialid,
        horizontal: this.formData.horizontal,
        vertical: this.formData.vertical
      };
      addPipeSectionApi(params).then(res => {
        this.$message.success('生成规则截面成功');
        this.$emit('confirmGenerate', res); // 触发事件并传递生成的截面数据
      }).catch(() => {
        this.$message.error('生成规则截面失败');
      });
    }
  }
};
</script>